<template>
  <div class="h-full">
    <k-form-build :value="configJsonData" :dynamicData="dynamicData" />
  </div>
</template>

<script>
export default {
  data() {
    return {
      dynamicData: {
        funName: this.printHelloWorld
      },
      configJsonData: {
	"list": [
		{
			"type": "flex",
			"label": "flex布局",
			"columns": [
				{
					"width": "",
					"margin": "",
					"marginTop": "",
					"marginRight": "",
					"marginBottom": "",
					"marginLeft": "",
					"padding": "",
					"paddingTop": "",
					"paddingRight": "",
					"paddingBottom": "",
					"paddingLeft": "",
					"positionTop": "",
					"positionRight": "",
					"positionBottom": "",
					"positionLeft": "",
					"positionZIndex": "",
					"absolute": false,
					"list": [
						{
							"type": "text",
							"label": "中山市市场监督局",
							"icon": "icon-zihao",
							"options": {
								"textAlign": "center",
								"hidden": false,
								"showRequiredMark": false,
								"noFormItem": true,
								"color": "rgba(0, 0, 0, 0.9)",
								"fontFamily": "",
								"fontSize": "22pt"
							},
							"key": "text_1691481167830",
							"className": {
								"margin": "",
								"marginTop": "",
								"marginRight": "",
								"marginBottom": "mb-5",
								"marginLeft": "",
								"padding": "",
								"paddingTop": "",
								"paddingRight": "",
								"paddingBottom": "",
								"paddingLeft": ""
							}
						},
						{
							"type": "loginItem",
							"label": "登录项",
							"icon": "icon-gallery",
							"className": {
								"type": "text",
								"placeholder": "请输入用户名",
								"icon": "user",
								"margin": "",
								"marginTop": "",
								"marginRight": "",
								"marginBottom": "mb-5",
								"marginLeft": "",
								"padding": "p-2",
								"paddingTop": "",
								"paddingRight": "",
								"paddingBottom": "",
								"paddingLeft": "",
								"borderWidth": "border",
								"borderStyle": "border-solid",
								"borderColor": "border-gray-300",
								"borderRadius": "rounded",
								"backGroundColor": ""
							},
							"options": {
								"multiple": false,
								"disabled": false,
								"width": "100%",
								"clearable": true,
								"showSearch": false,
								"showLabel": false,
								"noFormItem": true
							},
							"model": "loginItem_1691481250439",
							"key": "loginItem_1691481250439",
							"rules": [
								{
									"required": false,
									"message": "必填项"
								}
							]
						},
						{
							"type": "loginItem",
							"label": "登录项",
							"icon": "icon-gallery",
							"className": {
								"type": "password",
								"placeholder": "请输入密码",
								"icon": "lock",
								"margin": "",
								"marginTop": "",
								"marginRight": "",
								"marginBottom": "mb-5",
								"marginLeft": "",
								"padding": "p-2",
								"paddingTop": "",
								"paddingRight": "",
								"paddingBottom": "",
								"paddingLeft": "",
								"borderWidth": "border",
								"borderStyle": "border-solid",
								"borderColor": "border-gray-300",
								"borderRadius": "rounded",
								"backGroundColor": ""
							},
							"options": {
								"multiple": false,
								"disabled": false,
								"width": "100%",
								"clearable": true,
								"showSearch": false,
								"showLabel": false,
								"noFormItem": true
							},
							"model": "loginItem_1691481264649",
							"key": "loginItem_1691481264649",
							"rules": [
								{
									"required": false,
									"message": "必填项"
								}
							]
						},
						{
							"type": "RxButton",
							"label": "RxButton",
							"icon": "icon-gallery",
							"options": {
								"multiple": false,
								"disabled": false,
								"clearable": true,
								"showSearch": false,
								"showLabel": false,
								"noFormItem": true,
								"type": "primary",
								"dynamicFun": "funName"
							},
							"model": "RxButton_1691481286600",
							"key": "RxButton_1691481286600",
							"rules": [
								{
									"required": false,
									"message": "必填项"
								}
							],
							"className": {
								"text": "登录",
								"icon": "login",
								"width": "w-full"
							}
						}
					],
					"flex": ""
				}
			],
			"options": {
				"noFormItem": true
			},
			"className": {
				"fontSize": "",
				"backGroundColor": "bg-white",
				"height": "",
				"display": "",
				"justifyContent": "",
				"alignContent": "",
				"justifyItems": "",
				"alignItems": "",
				"margin": "",
				"marginTop": "",
				"marginRight": "",
				"marginBottom": "",
				"marginLeft": "",
				"padding": "p-5",
				"paddingTop": "",
				"paddingRight": "pr-10",
				"paddingBottom": "pb-8",
				"paddingLeft": "pl-10",
				"borderWidth": "",
				"borderWidthTop": "",
				"borderWidthRight": "",
				"borderWidthBottom": "",
				"borderWidthLeft": "",
				"borderStyle": "",
				"borderColor": "",
				"borderRadius": "rounded-lg",
				"borderColorTop": "",
				"borderColorRight": "",
				"borderColorBottom": "",
				"borderColorLeft": "",
				"positionTop": "",
				"positionRight": "",
				"positionBottom": "",
				"positionLeft": "",
				"positionZIndex": "",
				"relative": false,
				"absolute": false,
				"fixed": false,
				"spaceX": "",
				"spaceY": "",
				"wrap": "",
				"shadow": "shadow-lg",
				"shadowColor": ""
			},
			"key": "flex_1691481130031",
			"model": "flex_1691481130031"
		}
	],
	"config": {
		"layout": "horizontal",
		"labelCol": {
			"xs": 4,
			"sm": 4,
			"md": 4,
			"lg": 4,
			"xl": 4,
			"xxl": 4
		},
		"labelWidth": 100,
		"labelLayout": "flex",
		"wrapperCol": {
			"xs": 18,
			"sm": 18,
			"md": 18,
			"lg": 18,
			"xl": 18,
			"xxl": 18
		},
		"hideRequiredMark": false,
		"customStyle": "",
		"formToggle": true,
		"pagesBg": "",
		"login": true,
		"containerCenter": true,
		"position": "bg-center",
		"repeat": "bg-no-repeat",
		"size": "bg-cover",
		"top": "",
		"right": "",
		"bottom": "",
		"left": ""
	}
}
    
    
    }
  },
  mounted() {

  },
  methods: {
    printHelloWorld() {
      alert("hello world");
    }
  }
};
</script>

<style lang="less">

</style>
